<template>
  <div class="project-card">
    <div class="mat-title-bar">
    <a :href="projectPath" class="mat-title">{{mat.title}}</a>
    </div>
    <div class="mat-intro" v-html="mat.intro"></div>
  </div>
</template>

<script>
import paths from "@/js/paths"
export default {
  props: ["mat"],
  computed: {
    projectPath() {
      return paths.join("/#/projects", this.mat.source, this.mat.title)
    }
  },
};
</script>

<style lang="stylus">

</style>